@import "common";

.lists-box{
  /*padding-top: 100/@rem;*/padding-bottom: 60/@rem;
  h1{margin-top: 58/@rem;font-size: 58/@rem;color: #2871d5;text-align: center;}
  .btn-show{display: block;margin: 38/@rem 75/@rem 0;border-radius: 10px;line-height: 78/@rem;font-size: 24/@rem;color: @color-blue;text-align: center;background-color: #e1f7ff;}
}

//详情页
.detail{
  h1{margin-bottom: 40/@rem;margin-bottom: 0;}
  h2{margin-top: 10/@rem;margin-bottom: 30/@rem;font-size: 32/@rem;color: @color-blue;text-align: center;
    i{display: inline-block;width: 28/@rem;height: 28/@rem;vertical-align: -2/@rem;
      &.grade-1{background: url("/src/img/grade-1.png") center center / cover no-repeat;}
      &.grade-2{background: url("/src/img/grade-2.png") center center / cover no-repeat;}
      &.grade-3{background: url("/src/img/grade-3.png") center center / cover no-repeat;}
      &.grade-4{background: url("/src/img/grade-4.png") center center / cover no-repeat;}
      &.grade-5{background: url("/src/img/grade-5.png") center center / cover no-repeat;}
    }
  }
  .c-list{margin-top: 20/@rem;}
}

//结果页
.result {
  .title{
    margin: 40/@rem 75/@rem 0 53/@rem;overflow: hidden;
    li{padding: 16/@rem 24/@rem;line-height: 36/@rem;font-size: 24/@rem;color: #4284d8;float: left;margin-left: 20/@rem;margin-top: 20/@rem;background-color: #e9f6fa;border-radius: 8px;}
  }
  .c-list{margin-top: 40/@rem;}
}

//解释文字
p.explain{
  margin-top: 42/@rem;padding: 0 86/@rem;color: #3e545f;font-size: 20/@rem;
}

//榜单样式
.c-list{
  margin: 58/@rem 75/@rem 0;border-radius: 8px;background-color: #e9f6fa;overflow: hidden;
  .tit{line-height: 82/@rem;padding: 0 42/@rem;font-size: 38/@rem;color: #fff;
    &.red{background-color: #e895b3;}
    &.black{background-color: #3e3e3e;}
    &.blue{background-color: #4284d8;}
  }
  .table-box{margin: 0 -1px;overflow: hidden;}
  table{
    width: 100%;border-collapse:collapse;margin: -1px 0;
    .two{width: 40%;}
    .one, .thr, .four{width: 20%;}
    .th,th,td{border: 1px solid rgba(186,197,200,0.3);line-height: 36/@rem;padding: 20/@rem 10/@rem;;text-align: center;color: #3e545f;font-weight: normal;font-size: 28/@rem;
      &.black{color: #3e545f;}
      &.left{text-align: left;padding-left: 42/@rem;padding-right: 42/@rem;}

    }
    td{color: #6690bc;}
  }
}